import styles from './edit.module.scss'
import {useTitle} from 'ahooks'
import EditCanvas from '../../components/editComponents/editCanvas'
import EditHeader from '../../components/editComponents/editHeader'
import { useStore } from '@/store'
import LeftPanel from '@/components/editComponents/leftPanel'
import RightPanel from '@/components/editComponents/rightPanel'


const Edit = ()=>{
  useTitle("Shaun-编辑问卷")
  const store = useStore()
   
  const handleClearSelect =()=>{
    store.setSelectedId('')
  }

  return (
    <div className={styles.container}>
      {/* 头部 */}
       <div className={styles.header}>
        <EditHeader></EditHeader>
       </div>
       {/* 主体内容 */}
       <div className={styles.body}>
          {/* 左部 */}
          <div className={styles.left}>
            <LeftPanel></LeftPanel>
          </div>
          <div className={styles.center} onClick={()=>handleClearSelect()}>
            <div className={styles.main} >
              <EditCanvas isDrag={true}></EditCanvas>
            </div>
          </div>
          <div className={styles.right}>
            <RightPanel ></RightPanel>
          </div>
       </div>
    </div>
  )
}



export default Edit;